<template>
  <div id="app">

    <transition name="slide-fadef">
      <router-view class="cContentVue"></router-view>
    </transition>

    <div id="ddloadings" v-show="isLoading">
      <div class="spinner">
        <div class="rect1"></div>
        <div class="rect2"></div>
        <div class="rect3"></div>
        <div class="rect4"></div>
        <div class="rect5"></div>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  name: 'app',
  methods: {

  },
  computed: {
    isLoading () {
      return this.$store.state.isload;
    }
  },
  created () {
      // this.islogo()
      // alert(this.islogo())
  }
}
</script>

<style lang="less">
@import '~vux/src/styles/reset.less';
@import './resources/fonts/iconfont.css';
body {
  background-color: #f5f5f5;
  font-size: 12px;
  font-family: 'Helvetica Neue',Helvetica,sans-serif;
  -webkit-overflow-scrolling: touch;
}
</style>

<style lang="scss">
$lzdcolor:#1acbbb;
body{
  background-color: #f5f5f5;
  color:#333;
  width:100%;
  height:100%;
  overflow:hidden;
}
#app .vux-header {
  background-color: #1acbbb;
}
.slide-fadef-enter-active {
  transition: all 0.6s  ease-in
}
.slide-fadef-leave-active {
  transition: all 0.3s ease-in;
}
.slide-fadef-enter
/* .slide-fadef-leave-active for <2.1.8 */ {
transform: translateX(900px) ;
  // opacity: 0;
}
.slide-fadef-leave-to{
    transform: translateX(-800px);
 }
a {
  color:#333;
}

// 公用css
.text-c{
  text-align: center;
}
.rigjt{  //箭头向右
  &:after {
    content: "\e602";
  }
}
.floatleft{
  float: left;
}
.pr {
  position:relative;
}
#app {
    width:100%;
  height:100%;
  overflow:hidden;
    -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Chrome/Safari/Opera */
  -khtml-user-select: none; /* Konqueror */
  -moz-user-select: none; /* Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Non-prefixed version, currently
not supported by any browser */
}
#app .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon, .weui-tabbar__item.weui-bar__item_on .weui-tabbar__icon > i, .weui-tabbar__item.weui-bar__item_on .weui-tabbar__label{
  color:$lzdcolor!important;
}
//load动画
#ddloadings{
  z-index: 10000000000;
  position:fixed;
  width: 100%;
  height: 100%;
  text-align: center;
  top: 0;
  left: 0;
  background-color:#fff;
}
.spinner {
  margin: auto;
  width: 100%;
  height: 60px;
  display: inline-block;
  text-align: center;
  font-size: 10px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.spinner > div {
  background-color: #1acbbb;
  height: 100%;
  width: 6px;
  display: inline-block;
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
  0%, 40%, 100% {
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% {
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}



</style>
